<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:wh="http://java.sun.com/jsf/composite/wh"
	xmlns:p="http://primefaces.org/ui"
	xmlns:oc="http://java.sun.com/jsf/composite/owncomponents">
<h:body>
	<ui:composition template="template/companyTemplate.xhtml">

		<ui:define name="companyContent">

			<h1>Personal Investments</h1>
			<h:form id="companyPersonal" styleClass="horizontal_full">
				<p>This site represents the investments for the personal.
					Personal investments could be education courses or new furniture so
					that the employees can perform on their best level. 
					Personal investments also help you to improve your image.</p>
				<h:panelGrid columns="2">
					<h:panelGrid columns="1">
						<h:panelGrid columns="3">
							<h:outputLabel for="personalThis" value="Personal-investment:" />
							<p:inputText id="personalThis" tabindex="1"
								value="#{companyMBean.employerEducationInvestment}" 
								validatorMessage="Personal-investment has to be a number between 0 and #{companyMBean.getMaxPersonal()}">
					        	<f:validateLongRange minimum="0" maximum="#{companyMBean.getMaxPersonal()}" />
					        </p:inputText>
					        <oc:fieldhelp helptext="Setting the personal investments for this round." show="true"/>
					        
							<h:outputText value=" " />
							<p:slider for="personalThis" step="10" minValue="0" maxValue="#{companyMBean.getMaxPersonal()}" style="min-width: 100px" />
							<oc:fieldhelp helptext="Slider helps you to set the investment between min and max-value." show="true"/>
							
							<h:outputLabel for="personalLast"
								value="Personal-investment (last round):" />
							<p:inputText id="personalLast" disabled="true"
								value="#{companyMBean.prevEmployerEducationInvestment}" />
							<oc:fieldhelp helptext="You have set this investment in the last round." show="true"/>
						</h:panelGrid>

						<p:commandButton value="Save Personal Decisions"
							icon="ui-icon-disk"
							actionListener="#{companyMBean.savePersonalDecision}" />
					</h:panelGrid>
					<p:chart type="line"
						model="#{companyMBean.personalInvestmentsChart}"
						styleClass="companyDecisionChart" />
				</h:panelGrid>
			</h:form>

		</ui:define>
	</ui:composition>
</h:body>
</html>